<?php
$conn = mysql_connect("localhost", "root", "643313") or die(mysql_error());
mysql_select_db("regist_sys");

$sql_dep = "SELECT * FROM department";
$result_dep = mysql_query($sql_dep,$conn) or die(mysql_error());

$sql_research = "SELECT * FROM research";
$result_research = mysql_query($sql_research,$conn) or die(mysql_error());
$num = mysql_num_rows($result_research);

echo "<script language=javascript> \n";

echo "department = new Array(); \nresearch = new Array();\n";
$i = 0;
while ($row = mysql_fetch_assoc($result_research)) {
	echo "department[$i]='$row[department]';\n";
	echo "research[$i]='$row[research]';\n";
	$i++;
}
echo "</script> \n";
?>
<script type="text/javascript" language="javascript">
function depChange(dep) {
	<?php echo "var n = $num;\n";?>
	professorform.research.length = 0;
	for (var i=0;i<n;i++) {
		if (department[i]==dep) {
			var newOption = document.createElement("option");
			  newOption.text = research[i];
			  newOption.value = research[i];
			  var sel = document.getElementById("research");
			  try {
				    sel.add(newOption, null); // standards compliant; doesn't work in IE
				  }
				  catch(ex) {
				    sel.add(newOption); // IE only
				  }
		}
	}
}
</script>
<div id="main">
	<form action="reg_professor.php" name="professorform" method="post">
		<fieldset>
			<legend>Professor Registration</legend>
			<table width="400" border="0" cellspacing="0" cellpadding="0">
				<tr>
					<td>
						<p>
							<label>ID</label>
						</p>
					</td>
					<td><p>
							<input type="text" name="id" />
						</p></td>
				</tr>
				<tr>
					<td>
						<p>
							<label>First name</label>
						</p>
					</td>
					<td><p>
							<input type="text" name="firstName" />
						</p>
					</td>
				</tr>
				<tr>
					<td>
						<p>
							<label>Last name</label>
						</p>
					</td>
					<td><p>
							<input type="text" name="lastName" />
						</p></td>
				</tr>
				<tr>
					<td>
						<p>
							<label>Department</label>
						</p>
					</td>
					<td><p>
							<select name="department"
								onchange="depChange(this.options[this.selectedIndex].text);">
								<option>--Select Dept--</option>
								<?php
								while ($row = mysql_fetch_assoc($result_dep)) {
									print "<option>";
									print $row["department"];
									print "</option> \n";
								}
								?>
							</select>
						</p>
					</td>
				</tr>
				<tr>
					<td>
						<p>
							<label>Research Area</label>
						</p>
					</td>
					<td><p>
							<select id="research" name="research">

							</select>
						</p>
					</td>
				</tr>

				<tr>
					<td><p>
							<button type="submit">Submit</button>
							<button type="reset">Reset</button>
						</p>
					</td>
				</tr>
			</table>
		</fieldset>
	</form>

</div>
